<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>用户登录首页</title>
    <link rel="stylesheet" href="css/index.css" />
    <script type="text/javascript" src="/static/js/jquery-3.6.0.js"></script>
</head>
<body>
<%--            --%>
<div class="divright">
    <div class="login">
        <form action="/user.do" method="post">
            <input type="hidden" name="method" value="repwd">
        <input type="submit" class="rePassword" id="rePassword" style="margin-left: 250px;" value="忘记密码"></input>
        </form>
        <h2>用户登录</h2>
        <form action="/user.do" method="post">
            <div class="login_box">
                <input type="text" name="username" id = "username" required /><label id="label1">用户名</label>
                <span></span>
            </div>
            <div class="login_box">
                <input type="password" name="password" id = "password" required="required" /><label id="label2">密码</label>
                <span style="margin-bottom: 5px;color: white"><%--返回输出的错误信息--%>
                    <c:if test="${message!=null}">
                        <c:out value="${message}"></c:out>
                    </c:if></span>
            </div>
            <a href="javascript:void(0)">
                <input type="submit" value="立即登录" name="sub" id="sub" disabled style="background: rgba(0,0,0,0);border: 0;
	 color: #f7ae10;">
                <input type="hidden" name="method" value="login">
                <span></span>
                <span></span>
                <span></span>
                <span><a href="/commons/register.jsp" style="left: 80px;font-size: x-small;margin-right: 10px">立即注册</a></span>
            </a>
        </form>
    </div>
</div>
<script>
    $(function () {
        //1.验证用户名是否存在
        $("#username").change(function () {
            $.getJSON("/user.do", {username: $(this).val(), method: "checkUserName"}, function (resp) {
                if (resp) {
                    //true 用户名未注册
                    // $("#username").parents("td").next().html("用户名未注册");
                    $("#label1").html("用户名未注册");
                    $("#sub").attr("disabled","disabled");
                } else {
                    //false 用户名正确
                    // $("#username").parents("td").next().html("用户名正确");
                    $("#label1").html("用户名正确");
                    $("#sub").removeAttr("disabled");
                }
                //处理label为空时，提示信息为用户名
                if($("#username").val()==""){
                    $("#label1").html("用户名");
                }
            })
        })
    })
</script>
</body>
</html>
